<?php
/*
Template Name: Principal
*/
?>

<?php 

get_header(); 


?>

<?php 
	error_reporting(0);
	include_once("db/grupos_sanguineos.class.php");
	
	if($_POST['axn']=="save"){
		include_once("db/usuarios.class.php");
		include_once("db/bancos_has_usuarios.class.php");
		$usuarios = new usuarios();
		
		$usuarios->setDireccion($_POST['addressForm']);
		$usuarios->setLat($_POST['lat']);
		$usuarios->setLng($_POST['lng']);
		$usuarios->setEdad($_POST['edad']);
		$usuarios->setNombre($_POST['nombre']);
		$usuarios->setDistancia($_POST['distanciaForm']);
		$usuarios->setMail($_POST['mail']);
		$usuarios->setGrupos_sanguineos_id($_POST['grupo_sanguineo']);
		
		$userId = $usuarios->insert();
		if($userId!=0){
			$bancos_usuarios = new bancos_has_usuarios();
			$bancos_from_selectd = $_POST['bancosSelected'];
					
			foreach ($bancos_from_selectd  as $bancoseleccionado){
				$bancos_usuarios = new bancos_has_usuarios();
				$bancos_usuarios->setBancos_id($bancoseleccionado);
				$bancos_usuarios->setUsuarios_id($userId);
				$bancos_usuarios->insert();
			}
		}
		
		//Mail
		$para      = $_POST['mail'];
		$titulo = 'Bienvenido al grupo de dadores';
		$mensaje = "Gracias por inscribirse.";
		$cabeceras = 'From: martin.brambati@winguweb.org' . "\r\n" .
	    'Reply-To: no-replay@winguweb.org' . "\r\n" .
	    'X-Mailer: PHP/' . phpversion();
		mail($para, $titulo, $mensaje, $cabeceras);
	
		$message ="Gracias por inscribirse!";
		$displayMessage = "";
		//$displayMain = "display:none";
	}else{
		$message ="";
		$displayMessage = "display:none;";
	}
	echo "<script>var ruta=\"";
	echo bloginfo("template_url");
	echo "\";</script>"; 
?>


<!-- SCRIPTS y ESTILOS PARA DONAR SANGRE -->

<link rel="stylesheet" type="text/css" href="<?php echo bloginfo("template_url")?>/css/style.css">
<link rel="stylesheet"
	href="<?php echo bloginfo("template_url")?>/css/slider.css">
<link rel="stylesheet"
	href="<?php echo bloginfo("template_url")?>/css/theme.css">


<script
	type="text/javascript"
	src="http://maps.googleapis.com/maps/api/js?libraries=geometry&sensor=false&language=es"></script>
<script
	src="https://maps.googleapis.com/maps/api/js?sensor=false&libraries=places"
	type="text/javascript"></script>

<script
	type="text/javascript" src="<?php echo bloginfo("template_url")?>/js/funciones.js"></script>
<script
	type="text/javascript" src="<?php echo bloginfo("template_url")?>/js/point.js"></script>
<script
	src="<?php echo bloginfo("template_url")?>/js/jquery-1.7.2.js"></script>
<script
	src="<?php echo bloginfo("template_url")?>/js/jquery.ui.core.js"></script>
<script
	src="<?php echo bloginfo("template_url")?>/js/jquery.ui.widget.js"></script>
<script
	src="<?php echo bloginfo("template_url")?>/js/jquery.ui.mouse.js"></script>
<script
	src="<?php echo bloginfo("template_url")?>/js/jquery.ui.slider.js"></script>
<script
	src="<?php echo bloginfo("template_url")?>/js/jquery_validate.js"></script>

<!-- FIN SCRIPTS y ESTILOS PARA DONAR SANGRE -->
<div id="primary">
			<div id="content" role="main">
		
		<div id="colB">
		<p id="introduccion" class="intro">Dadoresdesangre.org es una iniciativa sin fines de lucro,<br />
                	que tiene c&oacute;mo fin facilitar e incrementar la donaci&oacute;n de<br />
                	sangre en nuestra regi&oacute;n de una manera muy pr&aacute;ctica y <br />
                	en forma din&aacute;mica. <br/><br/>En s&oacute;lo <strong>3 pasos</strong>, pod&eacute;s ayudar a mucha gente que te necesita.</p>
                    
                   
                    	<div id="btnDonar">
                    		<p style="text-align:center;"><strong><h1><span id="pasos">Paso 1 de 3: Encontr&aacute; tu punto de donaci&oacute;n</span></h1></strong></p>
                    	</div>
			<div id="colBTab" style="padding-bottom: 0px;height:166px">
				<div id="formu">
									
				    <h2>D&oacute;nde estoy</h2>
					<div>
					
					
							
						<input type="radio" name="searchType" id="search"
							onclick="searchMode();" checked> <input id="searchTextField"
							type="text" size="40"
							placeholder="Introduce calle y altura" autocomplete="off"
							onclick="$('#search').attr('checked', 'checked');searchMode();">
						<input type="radio" name="type" id="changetype-all"
							checked="checked" style="display: none;"> <input type="radio"
							name="type" id="changetype-establishment" style="display: none;">
						<input type="radio" name="type" id="changetype-geocode"
							style="display: none;">
							
					<span id="bx" style="display:none;">
					 
						<span id="txtbx" >&nbsp; &oacute;&nbsp;
						<input type="radio" name="searchType"
							id="currentPos" onclick="searchMode();"> <a
							style="text-decoration: none; color: black;" class="intro2"
							href="javascript:miPosicion();">Mi ubicaci&oacute;n</a>
						</span>
					</span>

					</div>
					
					<h2>Cu&aacute;nto est&aacute;s dispuesto a caminar</h2>
					<div style="float:left;">
					<input type="hidden" id="distancia" onChange="drawCircle();"/>
					<input type="text" id="distanciau"
							style="border: 0; color: red; font-weight: bold; width: 73px; margin-top: 4px;"
							onfocus="blur(this)" /></div><div id="slider-range-min" style="width: 240px; margin-left: 15px;margin-top:20px; float: right;right: 150px;">

					</div>
					
					<div style="clear: both;">
						<input type="button" id="btn" name="btn" value="Siguiente"
							class="btn btn-danger" />
					</div>

				</div>

				<form id="dador" name="dador" action="" method="post">
			<div id="paso3" style="display: none;text-align: left; " >
						<center>
						<input
							type='button' value='Volver al paso 2' onclick='anteriorPaso3();'
							class="btn btn-danger" /><input type='submit' name='enviar' style='margin: 2px'
							value='Enviar' class="btn btn-danger" />
						</center>
						<div id='izq' style="margin-top: 10px;">
						<table>
							<tr>
								<td style="vertical-align: middle;">Mail:</td>
								<td><input type='text' name='mail' id='mail' /></td>
							</tr>
							<tr >
								<td style="vertical-align: middle;">Nombre y Apellido:</td>
								<td><input type='text' name='nombre' id='nombre' /></td>
							</tr>
							<tr>
								<td style="vertical-align: middle;">Edad:</td>
								<td><input type='text' maxlength='2' name='edad' id='edad' /></td>
							</tr>
							<tr>
								<td style="vertical-align: middle;">Grupo sangu&iacute;neo:</td>
								<td><select name='grupo_sanguineo' >
										<option value=''>- Seleccione -</option>
										
										<?php 
										$grupos_sanguineos = new grupos_sanguineos();
										$grupos_sanguineos  = $grupos_sanguineos->readArray();
										foreach($grupos_sanguineos as $grupo_sanguineo){
											echo "<option value='".$grupo_sanguineo->getId()."'>".$grupo_sanguineo->getGrupo_sanguineo()."</option>";
										}
										?>
								</select></td>
							</tr>
							
							
							

						</table>
								<input type='hidden' name='distanciaForm' id="distanciaForm" /> 
									<input type='hidden' name='direccion'  /> 
									<input type='hidden' name='lat' id="lat"  />
									<input type='hidden' name='lng' id="lng" /> 
									<input type='hidden' name='axn' value="save" />
									<input type='hidden' name='addressForm' id="addressForm" />
					</div>
					
					<!-- paso3interno se reemplaza por javascript -->
					<div id="paso3interno"></div>
				
			</div>
			
		
			
			<div id="botones" style="display: none;text-align: left; OVERFLOW: auto; height: 40px;" ></div>
			<div id="bcos" style="display: none;" ></div>
			</form>
			</div>
		</div>	
		<div id="colMapa">
			<table>
				<tr>
					<td VALIGN="top">
						<div id="map_canvas" style="height: 350px; width:722px; display:block">
						</div>
					</td>
					<td VALIGN="top">
						<div id="directionsPanel" style="display: none;OVERFLOW: auto; width:250px;height 80px">
						</div>
					</td>
				</tr>
			</table>
		</div>
	</div> 

	<script>
		google.maps.event.addDomListener(window, 'load', initializeAutocomplete);
	
		$(function(){
			$('#dador').validate({
				rules: {
				'nombre': 'required',
				'mail': { required: true, email: true },
				'edad':  { required: true, number: true },
				'grupo_sanguineo': 'required'
				},
				messages: {
				'nombre': 'Debe ingresar el nombre',
				'mail': { required: 'Debe ingresar un correo electr&oacute;nico', email: 'Debe ingresar el correo electr&oacute;nico con el formato correcto. Por ejemplo: u@localhost.com' },
				'edad': { required: 'Debe ingresar la edad', number: 'Debe ingresar un n&uacute;mero' },
				'grupo_sanguineo': { required: 'Debe ingresar el grupo sangu&iacute;neo'}
				},
				debug: false,
				/*errorElement: 'div',*/
				//errorContainer: $('#errores'),
				submitHandler: function(form){
					form.submit();
				}
			});
		});		
	</script>	 
	
	<?php if($message){?>	<script>
		alert("<?php echo $message?>");
	</script><?php }?>
<?php get_footer(); ?>